<template>
	<view class="content">

		<view class="search-list">
			<view class="list-hui">

			</view>
			<view class="search-res">
				根据您的要求，为您找到以下产品
				<view class="down_arrows">

				</view>
			</view>

			<view class="custom">
				<view v-for="(item,index) in seachList" :key="index" class="custom-list">

					<view class="list-image">
						<image :src="item.pro_pic_url" mode="" />
						<view class="list-text">
							{{item.country}}轻轻的我来了
						</view>
						<view class="custom-news">
							<text class="iconfont icon-diliweizhi">{{item.country}}</text>
							<text class="iconfont icon-shijian">{{item.routing_data}} 天{{item.routing_nigth}}晚</text>
							<text class="iconfont icon-03">{{item.collection_num}}</text>

						</view>

					</view>

				</view>

			</view>
			<view class="reject">
				<view class="search-res1">
					如果您对以上产品均不满意
					<view class="search-err">猛戳下面按钮，把您的需求提交给我们，定制师将为您量身设计线路。</view>
					<view class="down_arrows1">


					</view>
					<view class="down_sj ">
						提交新需求
					</view>
					<view class="text-p">
						产品详情页面右下的【NEW】按钮有同样的功能哦。
					</view>

				</view>
			</view>


		</view>
		<view v-if="endtype">
			我是有底线的...
		</view>
	</view>
</template>

<script>
	import http from "../../until/http.js";
	export default {
		data() {
			return {
				seachList: [],
				endtype: false,
				optype: '',
				page:0
			}
		},
		onLoad(options) {
			console.log(options);
			this.optype = options.inputtype;
			this.getData();
			uni.stopPullDownRefresh()
		},
		onPullDownRefresh() {
			 this.page=1;
			this.getData()
			this.seachList = [],
				this.endtype = false

		},
		onReachBottom() {
			console.log('触底了');
			this.getData()
		},
		methods: {
			getData() {
				

				if (!this.endtype) {
					this.page++;
					http.request('/requirement/request/getMatchedProducts', 'POST', {
						"keyWord": this.optype,
						"curPagePath": "/wx/customer/classic/search.html?pageid=hHnmMJVAvKAEnsS6XLoI",
						"product_type": 1,
						"pageNow": this.page,
						"pageSize": 10
					}).then(res => {
						console.log(res);
						const data = res.data.matchedProducts
						if (data.length == 0) {

						} else {
							const oldArr = this.seachList
							this.seachList = [...oldArr, ...data]
						}

					})
				}
				uni.stopPullDownRefresh()

			},
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	/* pages/list/list.wxss */
	.search-list {
		width: 100%;
		background: #f2f2f2;

	}

	.list-hui {
		width: 100%;
		height: 10rpx;
		background: #f2f2f2;

	}

	.search-res {

		background: url(http://www.51houniao.com/wx/customer/classic/images/title-icon.png?v=bbc35a9) left top no-repeat #fff;
		margin-top: 10rpx;
		background-size: 22px;
		position: relative;
		width: 100%;
		text-align: center;
		font-size: 32rpx;
		font-weight: bold;
		height: 72rpx;
		color: #333333;
		margin-bottom: 10rpx;
	}

	.down_arrows {
		position: absolute;
		bottom: -20rpx;
		left: 48%;
		width: 0;
		height: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-top: 8px solid #ccc;
	}

	.custom {
		display: flex;
		flex-direction: column;
		/* margin-bottom: 760rpx; */

	}

	.custom .custom-list:last-child {
		margin-bottom: 450rpx;
	}

	.custom-list {
		margin-top: 40rpx;
		width: 750rpx;
		height: 822rpx;
	}

	.list-image {
		width: 702rpx;
		height: 702rpx;
		margin-left: 20rpx;
	}

	.list-image image {
		width: 702rpx;
		height: 702rpx;
	}

	.list-image .list-text {
		text-align: center;
		color: #919292;
		height: 74rpx;
		line-height: 74rpx;

	}

	.list-image .custom-news {
		text-align: center;
		color: #919292;
		height: 74rpx;
		line-height: 74rpx;

	}

	.reject {

		height: 360rpx;
		background: #f2f2f2;
		position: fixed;
		bottom: 0rpx;
		left: 0;

	}

	.search-res1 {
		position: relative;
		margin-top: 20rpx;
		background: url(http://www.51houniao.com/wx/customer/classic/images/title-icon.png?v=bbc35a9) left top no-repeat #fff;
		background-size: 22px;

		width: 100%;
		text-align: center;
		font-size: 32rpx;
		font-weight: bold;
		height: 102rpx;

		margin-bottom: 10rpx;
	}

	.search-err {
		margin-top: 20rpx;
		font-size: 24rpx;
		color: #666;
		width: 100%;
		height: 32rpx;
		line-height: 32rpx;
		margin-bottom: 20rpx;
	}

	.down_arrows1 {
		position: absolute;
		bottom: -20rpx;
		left: 48%;
		width: 0;
		height: 0;
		border-left: 10px solid transparent;
		border-right: 10px solid transparent;
		border-top: 8px solid #ccc;

	}

	.down_sj {
		margin: 40rpx 0 40rpx 34%;

		width: 208rpx;
		height: 74rpx;
		text-align: center;
		line-height: 74rpx;
		padding: 8px 12px;
		background: #ec7a27;
		color: #fff;
		font-size: 16px;
		border-radius: 8px;
	}

	.text-p {
		color: #445356;
		font-size: 12px;
		/* margin-bottom: 20rpx ; */
	}
</style>